<template>
  <div class="goodsaction">
    <van-goods-action>
      <van-goods-action-icon
        icon="wap-home-o"
        text="首页"
        color="#ee0a24"
        to="/home"
      />
      <van-goods-action-icon
        icon="cart-o"
        text="购物车"
        :badge="badge"
        @click="toShopping"
      />
      <van-goods-action-icon
        v-if="show"
        icon="star"
        text="收藏"
        @click="onClickIcon(true)"
        color="#888"
      />
      <van-goods-action-icon
        v-else
        icon="star"
        text="已收藏"
        @click="onClickIcon(false)"
        color="#FB4E30"
      />
      <van-goods-action-button type="danger" text="立即购买"  @click="onClickButton"/>
    </van-goods-action>
  </div>
</template>

<script>
import {
  GoodsAction,
  GoodsActionIcon,
  GoodsActionButton,
  Icon,
  Toast,
} from "vant";
import API from "@/utils/api.js";
export default {
  name: "goodsaction",
  props: ["productList"],
  data() {
    return {
      badge: 0,
      show: true,
      id: this.$route.query.id,
    };
  },
  created() {
    this.getShopping();
    this.$get(API.GET_COLLECT_LIST, {
      type: 0,
    }).then((res) => {
      for (let index = 0; index < res.data.list.length; index++) {
        if (res.data.list[index].valueId == this.id) {
          this.show = false;
        } else {
          this.show = true;
        }
      }
    });
  },
  methods: {
    onClickIcon(e) {
      if (e == true) {
        this.show = false;
        Toast("已收藏");
      } else if (e == false) {
        this.show = true;
        Toast("已取消收藏");
      }
      this.$post(API.POST_COLLECT_ADDORDELETE, {
        valueId: this.$route.query.id,
        type: 0,
      }).then((res) => {});
    },
    getShopping() {
      this.$get(API.GET_CART_GOODSCOUNT, {
        token: this.$store.state.token,
      }).then((res) => {
        console.log(res);
        this.badge = res.data;
      });
    },
    toShopping() {
      this.$router.push("/shopping");
    },
    onClickButton() {
      this.$post(API.POST_CART_FASTADD, {
        token: this.$store.state.token,
        goodsId: this.productList[0].goodsId,
        number: 1,
        productId: this.productList[0].id,
      }).then((res) => {
        console.log(res);
        this.$router.push({
          path: "/order",
          query: {
            cartId: 0,
          },
        });
      });
    },
  },
  computed: {},
  components: {
    [GoodsAction.name]: GoodsAction,
    [GoodsActionIcon.name]: GoodsActionIcon,
    [GoodsActionButton.name]: GoodsActionButton,
    [Icon.name]: Icon,
    [Toast.name]: Toast,
  },
};
</script>

<style scoped>
</style>
